<!doctype html>
<html> 
    <head>
        <meta charset="utf-8">
        <title>Curso Angular 2014 - jQuery</title>
        <!-- jQuery -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
        <!-- Bootstrap CSS -->
        <link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
        <!-- Bootstrap JavaScript -->
        <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
    </head>
    <body>
        <script type="text/javascript">
            $(document).ready(function () {
                var searchValue = "";
                setInterval(checkTextboxChanged, 0.5);

                function checkTextboxChanged() {
                    var currentValue = $("#nombre").val();
                    if (currentValue != searchValue) {
                        searchValue = currentValue;
                        TextboxChanged(currentValue);
                    }
                }

                function TextboxChanged(texto) {
                    $("#nombreMostrar").text(texto);
                }
            });
        </script>
        <div class="container">
            <hr>
            <form class="form-horizontal" role="form">
                <div class="form-group">
                    <label for="nombre" class="col-sm-2 control-label">
                        Ingrese su nombre:
                    </label>
                    <div class="col-sm-10">
                        <input type="text" class="form-control" id="nombre" 
                               placeholder="Ingrese su nombre aqui">
                    </div>
                </div>
            </form>
            <hr>
            <h1>
                Qué haces <span id="nombreMostrar"></span> !?!?
            </h1>
        </div>
    </body>
</html>